<template>
  <span style="position: relative;">
    <input type="file" id="files" accept=".csv, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" @change="upExcal">
    <a-button class="btnUp" @click="toUp" type="primary" icon="upload" :loading="spinning">导入</a-button>
  </span>
</template>
<script>
  import {importFile} from '@/api/courseManage/courseManage'
  export default {
    inject: ['upShow'],
    props: {
      type: [String,Number],
    },
    data() {
      return {
        spinning: false,
      }
    },
    methods: {
      toUp() {
        document.getElementById('files').click();
      },
      upExcal() {
        this.spinning = true
        var file = document.getElementById('files').files[0];
        var url = URL.createObjectURL(file);
//        console.log('url:'+url);
//        console.log('this.type:'+this.type);
        let formData = new FormData();
        formData.append("file", file);
        formData.append("type", this.type);
//        0:课程类型导入;1:法律法规导入;2:视频资料导入;3:题库导入；4:题目导入；5重点排污企业导入;6:警示教育企业导入
          importFile(formData).then(res => {
            this.spinning = false
            if(res.code == 200) {
              this.upShow(1,"导入成功")
              this.$emit('handleSearch')
            } else {
              this.upShow(2,res.msg)
            }
          }).catch(err => {
            this.spinning = false
            this.upShow(2)
          })
      },
    }

  }
</script>
<style scoped="" lang="less">
  input {
    opacity: 0;
    width: 160px;
    height: 33px;
  }
  .btnUp {
    position: absolute;
    left: 0;
    top: 2px;
    width: 160px;
    height: 33px;
    font-size: 15px;
    span {
      display: inline-block;
      width: 100px;
      overflow: hidden;
      text-overflow:ellipsis;
      white-space: nowrap;
      vertical-align: middle;
    }
  }
</style>